<template>
  <div id="body" class="flex-box">
    <div class="navigate-box">
      <el-menu
        default-active="2"
        router
        class="el-menu-vertical-demo">
        <el-menu-item index="/managermanagement/managerinformation">
          <i class="el-icon-document"></i>
          <span slot="title">个人信息</span>
        </el-menu-item>
        <el-menu-item index="/managermanagement/homeworkcollection">
          <i class="el-icon-document"></i>
          <span slot="title">作业集</span>
        </el-menu-item>
        <el-menu-item index="/managermanagement/host">
          <i class="el-icon-menu"></i>
          <span slot="title">主机</span>
        </el-menu-item>
        <el-menu-item index="/managermanagement/managerhostaccount">
          <i class="el-icon-menu"></i>
          <span slot="title">主机账号</span>
        </el-menu-item>
        <el-menu-item index="/managermanagement/statistic">
          <i class="el-icon-menu"></i>
          <span slot="title">流量统计</span>
        </el-menu-item>
      </el-menu>
    </div>
    <div class="show-box">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
    export default {
        name: "Index"
    }
</script>

<style scoped>
  #body{
    width: 100%;
    height: 100%;
    background-color: #f2f2f2;
  }

  .navigate-box{
    width: 300px;
    background-color: white;
  }

  .show-box{
    width: 100%;
    /*height: 100%;*/
    min-height: 1000px;
  }
</style>
